fetch('http://localhost:3030/api/food/getFoodList', {
    method: 'get'
}).then((response)=>{
    return response.json()
}).then((result) => {
    if(result.code == '0'){
        let html = '';
        result.data.map(item=>{
            html += `
                <div class="list-item">
                    <div class="list-item-content">
                    <img src="${item.albums[0]}" class="item-img" />
                    <div class="item-bottom">
                        <p class="item-title">${item.title}</p>
                    </div>
                    </div>
                </div>
            `
        });
        document.querySelector('.list-container').innerHTML = html;
    }
})

// const xhr = new XMLHttpRequest();
// xhr.open('get', 'http://localhost:3030/api/food/getFoodList');
// xhr.send();

// xhr.onreadystatechange = function () {
//     if (xhr.readyState == 4) {
//         if (xhr.status == 200 || xhr.status == 0) {
//             const result = JSON.parse(xhr.responseText);
//             if (result.code == '0') {
//                 let html = '';
//                 result.data.map(item => {
//                     html += `
//                         <div class="list-item">
//                             <div class="list-item-content">
//                             <img src="${item.albums[0]}" class="item-img" />
//                             <div class="item-bottom">
//                                 <p class="item-title">${item.title}</p>
//                             </div>
//                             </div>
//                         </div>
//                     `
//                 });
//                 document.querySelector('.list-container').innerHTML = html;
//             }
//         }
//     }
// }